:root {
  /* 主页标题渐变色 */
  --vp-home-hero-name-color: transparent;
  --vp-home-hero-name-background: -webkit-linear-gradient(120deg, #bd34fe, #41d1ff);
}

/* 隐藏滚动条 */
:root::-webkit-scrollbar {
  display: none;
}

/* logo 高度重新设置 */
.VPImage.logo {
  height: 52px;
}

/* 去除 logo title 背景色 */

@media (min-width: 1440px) {
  :global(.VPNavBarTitle) {
    width: 22.66vw;
    /* margin-left: -13.28vw; */
  }
}

:global(.VPNavBarTitle .VPImage) {
  margin-left: -13% !important;
}

@media (min-width: 1440px) {
  :global(.VPNavBarTitle .VPImage) {
    /* margin-left: 30px; */
  }
}

.VPNavBarTitle {
  background-color: transparent !important;
  border-bottom-color: transparent !important;
}


@media (min-width: 960px) {
    :global(.curtain) {
        position: sticky;
        top: calc(var(--vp-nav-height) * -1);
        left: 0;
        z-index: 1;
        margin-top: calc(var(--vp-nav-height) * -1);
        margin-right: -32px;
        margin-left: -32px;
        height: var(--vp-nav-height);
        background-color: transparent !important;
    }
}

.VPNav {
  background-color: transparent !important;
  /* 白天模式：白色边框 */
  border-bottom: 1px solid #E2E2E3 !important;
}

/* 黑夜模式：黑色边框 */
html.dark .VPNav {
  border-bottom: 1px solid #000000 !important;
}

@media (min-width: 960px) {
  :global(.VPNavBarTitle.has-sidebar .title.title),
  :global(.VPNavBarTitle.has-sidebar .title[class*="title"]) {
      border-bottom-color: transparent !important;
      border-bottom: none !important;
  }
  
  /* 方法2: 使用更高优先级的选择器链 */
  :global(.VPNavBarTitle.has-sidebar) :global(.title),
  :global(.VPNavBarTitle.has-sidebar) :global(.title.title) {
      border-bottom-color: transparent !important;
      border-bottom: none !important;
  }
  
  /* 方法3: 匹配所有可能的属性选择器（scoped 样式会添加属性） */
  :global(.VPNavBarTitle.has-sidebar .title[class]),
  :global(.VPNavBarTitle.has-sidebar .title[data-v]) {
      border-bottom-color: transparent !important;
      border-bottom: none !important;
  }
}

/* iconfont symbol 引入 */
.icon-font {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  overflow: hidden;
}

/* span 高亮文字包括 code 代码块的内容 */
span code {
  color: inherit !important;
}

/* markdown ==...== highlight (drake-juejin style) */
.VPDoc mark,
.vp-doc mark {
  border: .1em solid var(--height-light-border-color);
  color: var(--height-light-color);
  background-color: transparent;
  padding: .1rem .5rem;
  border-radius: 2rem;
  margin: 0 .2rem;
  font-size: .95rem;
}

/* -------------------------------------- */

.linear-color {
  /* background -> background-clip -> color 顺序不能乱, color 和 -webkit-text-fill-color 都可以 */
  background: -webkit-linear-gradient(120deg, #13b2c1, #d2cf16);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  /* -webkit-text-fill-color: transparent; */
}

html.dark body {
  color: var(--vp-c-text-1);
}

html.dark .vp-doc,
html.dark .VPDoc {
  color: var(--vp-c-text-1);
}

/* 让 VitePress 代码块在明暗模式下使用不同背景色 */
:root {
  /* 白天：浅灰背景的代码块，更贴近整体浅色页面 */
  --vp-code-block-bg: #f5f5f5;
}

html.dark {
  /* 夜间：深灰背景代码块，与暗色背景拉开一点层次 */
  --vp-code-block-bg: #202127;
}

/* 代码块行号颜色 - 白天模式灰色 */
:root {
  --vp-code-line-number-color: #888888;
}

html.dark {
  --vp-code-line-number-color: #6b7280;
}



/* ========== 任务列表样式 ========== */
.vp-doc .task-list-item {
  list-style: none;
}

.vp-doc .task-list-item input[type="checkbox"] {
  margin-right: 0.5em;
  margin-left: -1.5em;
}

/* ========== 脚注样式 ========== */
.vp-doc .footnotes {
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: 1px solid var(--vp-c-divider);
  font-size: 0.875rem;
}

.vp-doc .footnote-ref {
  font-size: 0.75rem;
  vertical-align: super;
}

/* ========== Mermaid 流程图样式 ========== */
.vp-doc div[class*="language-mermaid"] {
  background: var(--vp-c-bg-soft) !important;
  border: 1px solid var(--vp-c-divider);
  border-radius: 8px;
  max-height: 500px;
  overflow: hidden;
  position: relative;
  margin: 1rem 0;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.vp-doc div[class*="language-mermaid"]::-webkit-scrollbar {
  display: none;
}

.vp-doc .mermaid-wrapper {
  text-align: center;
  padding: 1rem;
  min-height: 80px;
  cursor: grab;
  transform-origin: center center;
  transition: transform 0.1s ease-out;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vp-doc .mermaid-wrapper:active {
  cursor: grabbing;
}

.vp-doc .mermaid-wrapper svg {
  max-width: 100%;
  max-height: 420px;
  height: auto;
}

/* Mermaid 缩放控制按钮 */
.mermaid-controls {
  position: sticky;
  top: 0;
  display: flex;
  justify-content: flex-end;
  gap: 4px;
  padding: 6px 8px;
  margin: 0 0 0 -50px;
  background: var(--vp-c-bg-soft);
  border-bottom: 1px solid var(--vp-c-divider);
  z-index: 10;
}

.mermaid-controls button {
  padding: 3px 8px;
  border: 1px solid var(--vp-c-divider);
  border-radius: 4px;
  background: var(--vp-c-bg);
  color: var(--vp-c-text-2);
  cursor: pointer;
  font-size: 12px;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
}

.mermaid-controls button:hover {
  background: #135CE0;
  color: white;
  /* border-color: var(--vp-c-brand); */
}

/* Mermaid 全屏模式 */
.mermaid-fullscreen {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  max-height: none !important;
  z-index: 9999 !important;
  border-radius: 0 !important;
  margin: 0 !important;
  background: var(--vp-c-bg) !important;
}

.mermaid-fullscreen .mermaid-controls {
  padding: 10px 16px;
}

.mermaid-fullscreen .mermaid-controls button {
  padding: 6px 12px;
  font-size: 14px;
}

.mermaid-fullscreen .mermaid-wrapper {
  height: calc(100vh - 50px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
}

.mermaid-fullscreen .mermaid-wrapper svg {
  max-width: 95vw;
  max-height: 85vh;
}

/* ========== 图片缩放样式 ========== */
.medium-zoom-overlay {
  z-index: 999;
}

.medium-zoom-image--opened {
  z-index: 1000;
}

/* ========== 上下标样式 ========== */
.vp-doc sub,
.vp-doc sup {
  font-size: 0.75em;
}

/* ========== 缩写样式 ========== */
.vp-doc abbr[title] {
  text-decoration: underline dotted;
  cursor: help;
}


